<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
	
	

<style type="text/css">
        #bg{ display: none;  position: absolute;  top: 0%;  left: 0%;  width: 100%;  height: 100%;  background-color: black;  z-index:1001;  -moz-opacity: 0.7;  opacity:.70;  filter: alpha(opacity=70);}
        #show{display: none;  position: absolute;  top: 10%;  left: 10%;  width: 780px;  height: 402px;  padding: 8px;  border: 8px solid #E8E9F7;  background-color: #eaeaea;  z-index:1002;  overflow: auto;}
		.gallery_box{
			position: fixed;
			top: 100px;
			left: 100px;
			right: 100px;
			bottom: 100px;
			background: #000;
			display: none;
			z-index:9999;
		}
</style>
<script type="text/javascript">

$(document).ready(function(){	
 
	var index = layer.load(3, {
		  content: "加载控件中...",
		  time: 1*1000,
		  shade: [0.4,'#333'] //0.1透明度的白色背景
	});
	layer.close(index);
	$("#popPhone").numkeyboard({
		keyboardRadix:1300,//键盘大小基数
	    mainbackground:'#eaeaea', //主背景色
	    menubackground:'#c8e5c4', //头背景色
	    exitbackground:'#c8e5c4', //关闭按钮背景色
	    buttonbackground:'#f6e6c6', //键盘背景色
	    clickeve:true//是否绑定元素click事件
	});

	//exit();

	//$("#numkeyboard1").focus();
	
});

function showKeyword(){
	$('#bg').show();
	$('#show').show();
    $("#popPhone").focus();
	$('#ca')[0].contentDocument.getElementById("view1").style.display="none";
	$("#cameraDiv").css("display","none");
	$("#menuListDiv").css("display","none");
	//$('.auth_keybord').scrollTop = document.body.scrollHeight;
	hw.switchSignMonitor();     		
	return ;
}

function closeKeyword(){
	
	var phone = $('#popPhone').val();
	
    if(!(/^1[3456789]\d{9}$/.test(phone))){ 
        layer.msg("手机号码有误，请重新输入");  
        return false; 
    }
    
    $('#phone').val(phone);
    
    $('#bg').hide();
	$('#show').hide();
	
    $('#ca')[0].contentDocument.getElementById("view1").style.display="";
	$("#cameraDiv").css("display","");
	$(".auth_keybord").css("display","none");
	$("#menuListDiv").css("display","");
	hw.switchPCMonitor();     
	hw.clear();
}

</script>

<div id="show">	
  <div class="form-group">		
	<input type="text" id="popPhone"  style="height:44px;line-height:44px;font-size:20px;font-family:inherit;" class="form-control" placeholder=""/>
   </div>
</div>

<div class="panel charger checkForm">
	<form class="form-horizontal"  role="form" :validate="@validate">
		<div class="formCenter">
			<%--<div class="form-group">--%>
				<%--<label class="col-sm-2 control-label">&nbsp;</label>--%>
				<%--<div class="col-sm-7">--%>
					<%--<div class="red">{{errMsg}}</div>--%>
				<%--</div>--%>
			<%--</div>--%>

			<div class="form-group">
				<label class="col-sm-2 control-label"><span class="col_red">*</span>被查人员证件类型：</label>
				<div class="col-sm-7">
					<select class="form-control input-sm" :duplex="@inquiryModel.cardType" :change="@changeIdType" id="idType">
						<option :for="el in @cardModel" ms-attr="{value: el.type}">{{el.name}}</option>
					</select>
				</div>
			</div>
            <div class="form-group">
				<label  class="col-sm-2 control-label"><span class="col_red">*</span>被查人员电话：</label>
				<div class="col-sm-7 ">
					<div class="pr">
						<input type="text" id="phone" class="form-control" placeholder="被查人员电话" :duplex="@inquiryModel.phone"/>
						<span id="signSpan">
							<a href="javascript:void(0);"  onclick="checkSid(showKeyword);" class="userInputBtn">用户输入</a>
						</span>
					    <iframe id = "userPhoneSignIframe"  width="0" height="0" src="resources/js/sign/userPhoneSign.html" frameborder="0" scrolling="false"></iframe>
					     
					</div>
				</div>
			</div>

			<div class="form-group">
				<label  class="col-sm-2 control-label"><span class="col_red">*</span>被查人员姓名：</label>
				<div class="col-sm-7 ">
					<div class="pr">
						<input type="text" id="userName" class="form-control" placeholder="请输入姓名" :duplex="@inquiryModel.userName" :rules="{required: true}" data-required-message="姓名不能为空" />
						<label class="errorTips" :visible="@errMsg.userName">{{errMsg.userName.message}}</label>
					</div>
				</div>
			</div>
			
			<div class="form-group">
				<label  class="col-sm-2 control-label"><span class="col_red">*</span>被查人员证件号码：</label>
				<div class="col-sm-7">
					<div class="pr">
						<input type="text" id="cardNum" class="form-control" placeholder="请输入被查人员证件号码" :duplex="@inquiryModel.cardNum" :rules="{required: true}" data-required-message="证件号码不能为空" />
						<label class="errorTips" :visible="@errMsg.cardNum">{{errMsg.cardNum.message}}</label>
					</div>
				</div>
			</div>
			<div class="form-group" :visible="@isIdCard()">
				<label class="col-sm-2 control-label">&nbsp;</label>
				<div class="col-sm-7">
					<div class="pr">
						<!--<input type="text" class="form-control" placeholder="请输入手机号码">
                           <label class="errorTips">错误提醒</label>   -->
						<span class="getIdInfo">
                               <a href="javascript:void(0);" :click="@readIdCard" class="getIdInfoA">获取二代身份证信息</a>
                       </span>
					</div>
				</div>
			</div>

			<div class="form-group" id="cameraDiv">
				<label class="col-sm-2 control-label"><span class="col_red">*</span>请拍摄：</label>
				<div class="col-sm-12 text-center">
					<div class="uploadBox" style="width: 100%;">
						<!--<h5>身份证正面</h5>-->
						<div id="videoContainer" class="uploadIdPic otherPic"><b>请拍摄证明材料</b></div>
						<p>
							<a href="javascript:void(0);" class="a-btn1 grey" :click="@scan(1,4)">拍摄证件照</a>
						</p>
                        <div class="thumbnail clearfix" :visible="@cardPic.length">
                            <div class="title">证件:</div>
                            <div class="content">
                                <ul class="pic-list" id="uploaderFiles">
                                    <li :for="($index, img) in @cardPic">
                                   	 	<img :attr="{src: img.path}" />
                                   	 	<a class="del" href="javascript:void(0);" :click="@removePic($index, 1)">X</a>
                                    </li>
                                </ul>
                            </div>
                        </div>

					</div>
				</div>
			</div>
		</div>
		<div class="gallery_box" id="gallery">
				<img src="">
		</div>
	</form>
</div>
<script type="text/javascript">
	$(document).on("click",".pic-list>li>img",function(e){
		/* $(this).css("width","2000px");
		$(this).css("height","2000px"); */
		/* e.stopPropagation();
		$(".gallery_box>img").attr("src",this.src);
		$(".gallery_box").fadeIn(100);  */
		
	})
	/* $(".gallery_box").on("click", function() {
		$(".gallery_box").fadeOut(100);
	}); */
</script>
<div class="text-center">
	<a href="javascript:void(0);" :click="@validate.onManual()" class="a-btn1">下一步</a>
</div>
<!--end content-->